
import MkMultiSelect from "./MkMultiSelect.vue";
/**
 * 调用多选弹框
 * @param props 弹框的配置项
 * @param searchFun 弹框调用的检索接口 
 * @returns 
 */
export default function useMkMultiSelect (props: any, searchFun: Function) {
  let instance: any;

  if(!instance) {
    // 将api放在后面，即以 组件的props 的形式传入
    const app = createApp(MkMultiSelect, { searchFun });
    const container = document.createElement("div");
    instance = app.mount(container);
    document.body.appendChild(container);
  }
  instance.open()
  return new Promise((resolve, reject) => {
    // 确认框回调
    const confirmCallback = (select: any) => {
      resolve(select)
    }
    // 取消/关闭
    const cancelCallback = () => {
      reject(undefined)
    }
    // 弹框消失前销毁组件
    const destory = () => {
      if (instance) {
        instance.$el.parentNode.remove();
        instance = null;
      }
    }
    instance.config = { ...instance.config, ...props, confirmCallback, cancelCallback, destory}
  })
}